import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import Layout from '../components/layout.vue'

import inFrames from './inFrames'

const outFrames = [
  {
    path: '/login',
    name: 'login',
    component: ()=>import('@/views/LoginPage.vue'),
    meta:{ 
      title:'我是登录页'
    }

  },
  {
      // 404
    path: '/:pathMatch(.*)*',
    component: ()=> import('@/views/NotFound.vue')
  },

]



const routes = [

  {
    path:'/',
    component: Layout,  // 匹配的之后渲染的路由 
    redirect:'/index',
    children: inFrames
    
  },
  ...outFrames
]

// createRuter  创建一个路由对象
const router = createRouter({
   // history 使用什么路由模式 
  history: createWebHashHistory(), //createWebHashHistory 哈希路由 
  // history:createWebHistory(),
  routes,// 路由项
})


//  路由全局守卫
// beforeEach 前置守卫
router.beforeEach((to,from,next)=>{
  console.log('全局守卫 from',from);
  console.log('全局守卫 to',to);
 
  const uid = window.localStorage.getItem('uid')  // 约定 如果登录了就在 localStorage当中保存uid
  const { path } = to;

  if(path === '/login') return next();  // 登录页不检验是否登录

  if(!uid) return next('/login')  // next 可以传入一个跳转对象 
  next();
 
})
// afterEach  后置守卫
router.afterEach((to,from)=>{

})


export default router
